<template>
	<view>
		<view class="card" v-for="(item,index) in detail">
			<image style="width:60px;height:60px;border-radius: 5px;" :src="item.self_img"></image>
		<view class="between">
			<text class="title">{{item.coach_name}}</text> <button @click="agree(item)" class="agree-button">同意</button>
			</view>
			<view style="width: 60%;">{{item.mobile}}</view>
			<view style="width: 60%;">{{item.text}}</view>
			<view class="between">
				<view>{{item.create_time}}  </view>
			
			<button class="deny-button" @click="refuse(item)">拒绝</button>
		</view>
		<view><text style="color: green;">{{item.status}}</text></view>
		</view>

	<abnor v-if="detail.length<=0"></abnor>
	
	</view>
</template>

<script>
	import {
		mapState,
		mapActions,
		mapMutations
	} from "vuex"
	import $api from '@/api/index.js';
	export default {
		data() {
			return {
				detail:[]
			}
		},
		 onLoad() {  
		      // 页面加载时设置标题  
		      this.setTitle(); 
			   this.getProcesslist();
		    },  
		methods: {
			 setTitle() {  
			        uni.setNavigationBarTitle({  
			          title: '待审核列表' // 设置新的标题  
			        });  
					
				},
				async getProcesslist()
				{
					let param={
						type:'all'
					}
					let data = await this.$api.mine.processlist(param);
					this.detail = data;
				},
				async agree(item)
				{
					let param={
						coash_id:item.id
					}
					let data = await this.$api.mine.processagree(param);
					let url = `/user/pages/user-detail?id=${this.touid}`
					this.$util.goUrl({
						url: '/pages/process',
					})
				},
				async refuse(item)
				{
					let param={
						coash_id:item.id
					}
					let data = await this.$api.mine.processrefuse(param);
					this.$util.goUrl({
						url: '/pages/process',
					})
				},
	},
	}
</script>

<style>
.card{
	margin: 10px;
	background-color: #fff;
	border-radius: 10px;
	padding:10px;
}
.title{
	font-size: 20px;
	font-weight: 600;
}
.agree-button {  
  display: inline-block;  
  padding: 1px 15px;  
  font-size: 12px;  
  color: #ffffff;  
  background-color: #4CAF50; /* 绿色背景表示同意 */  
  border: none;  
  border-radius: 10px;  
  cursor: pointer;  
  text-align: center;  
  text-decoration: none;  
  transition: background-color 0.3s ease;  
  margin:5px;
}  
  
.agree-button:hover {  
  background-color: #45a049; /* 鼠标悬停时背景色变深 */  
}  
  
.agree-button:active {  
  background-color: #409040; /* 点击时背景色变深 */  
}
.deny-button {  
  display: inline-block;  
  padding: 1px 15px;  
  font-size: 12px;  
  color: #ffffff;  
  background-color: #f44336; /* 红色背景表示拒绝 */  
  border: none;  
  border-radius: 10px;  
  cursor: pointer;  
  text-align: center;  
  text-decoration: none;  
  transition: background-color 0.3s ease;  
   margin:5px;
}  
  
.deny-button:hover {  
  background-color: #e53935; /* 鼠标悬停时背景色变深 */  
}  
  
.deny-button:active {  
  background-color: #d32f2f; /* 点击时背景色变深 */  
}
.between{
	display: flex;  
	  justify-content: space-between;  
}
</style>
